<template>
  <goBack name="授权"></goBack>
<!--  <div v-if="zfbplatform==1" style="padding: 20px">-->
<!--    <p class="linkfont" @click="golink">{{ linkvalue }}</p>-->
<!--    <van-button-->
<!--        round-->
<!--        block-->
<!--        type="primary"-->
<!--        @click="copylink"-->
<!--        style="margin: 20px 0"-->
<!--    >-->
<!--      复制链接-->
<!--    </van-button>-->
<!--  </div>-->
<!--  <div class="codeimage" v-else>-->
<!--    <van-image width="120" height="120" :src="ali_qr" @click="aliclick"/>-->
<!--    <van-image width="120" height="120" :src="wx_qr" @click="wxclick"/>-->
<!--  </div>-->
  <div class="codeimage">
    <van-image width="120" height="120" :src="ali_qr" @click="aliclick"/>
    <van-image width="120" height="120" :src="wx_qr" @click="wxclick"/>
  </div>
</template>

<script setup>
import {payQrCode} from "@/api/merchant";
import {ref, onMounted} from "vue";
import {showImagePreview} from "vant";
import {useRoute} from "vue-router";
import {showToast} from "vant";
import {
  getUserid
} from '@/utils/auth';

const route = useRoute();

const ali_qr = ref(""); //支付宝
const wx_qr = ref(""); //微信

const linkvalue = ref("");
const zfbplatform = ref(0);

onMounted(() => {
  console.log("route.params", route.params)
  if (route.params && route.params.platform) {
    zfbplatform.value = route.params.platform;
  }
  getCode();
  // if (route.params.platform && route.params.platform == 0) {
  // } else if (route.params.gdyLink) {
  //   linkvalue.value = route.params.gdyLink;
  // }
});

const getCode = () => {
  const userId = getUserid();
  console.log(userId)
  payQrCode({userId}).then((res) => {
    ali_qr.value = res.data.ali_qr;
    wx_qr.value = res.data.wx_qr;
  });
};

// 支付宝点击
const aliclick = () => {
  showImagePreview([ali_qr.value]);
};

// 微信点击
const wxclick = () => {
  showImagePreview([wx_qr.value]);
};

const golink = () => {
  window.open(linkvalue.value);
};

function copylink() {
  try {
    if (navigator.clipboard && window.isSecureContext) {
      // 使用现代Clipboard API
      navigator.clipboard.writeText(linkvalue.value).then(() => {
        showToast('复制成功');
      }).catch(() => {
        throw new Error();
      });
    } else {
      // 使用传统方法
      const textArea = document.createElement('textarea');
      textArea.value = linkvalue.value;
      document.body.appendChild(textArea);
      textArea.select();
      document.execCommand('copy');
      document.body.removeChild(textArea);
      showToast('复制成功');
    }
  } catch (err) {
    showToast('复制失败');
  }
}
</script>

<style lang="scss" scoped>
.codeimage {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: space-around;
  //   align-items: center;
  padding: 20px;
  box-sizing: border-box;
}

.linkfont {
  text-align: center;
  color: #3014cc;
  text-decoration: underline;
  cursor: pointer;
}
</style>
